<template>
  <div class="hero">
    <slot></slot>
  </div>
</template>
<style>
.hero {
  margin: 0 auto;
  backface-visibility: hidden;
  max-width: 900px;
  animation: hero-animation 2.5s cubic-bezier(0.05, 0.35, 0.2, 1) forwards;
}

@keyframes hero-animation {
  0% {
    opacity: 0;
    transform: scale(2) ;
  }
  100% {
    opacity: 1;
    transform: scale(1) ;
  }
}
</style>
